// 动画效果组件

// 雨滴动画效果
function initRainAnimation() {
  const rain = () => {
    const cloud = document.querySelector('.cloud');
    if (!cloud) return;
    
    const drop = document.createElement('div');
    const left = Math.floor(Math.random() * 320);
    const width = Math.random() * 5;
    const height = Math.random() * 50;
    const duration = Math.random() * 0.5;

    drop.classList.add('drop');
    cloud.appendChild(drop);

    drop.style.left = left + 'px';
    drop.style.width = 0.5 + width + 'px';
    drop.style.height = 0.5 + height + 'px';
    drop.style.animationDuration = 1 + duration + 's';

    setTimeout(() => {
      if (cloud.contains(drop)) {
        cloud.removeChild(drop);
      }
    }, 2000);
  };

  // 每20毫秒生成一个雨滴
  return setInterval(rain, 20);
}

// 眼睛跟随鼠标动画
function initEyeFollowing() {
  document.querySelector('body').addEventListener('mousemove', (e) => {
    const eyes = document.querySelectorAll('.eye');
    eyes.forEach(eye => {
      const x = eye.getBoundingClientRect().left + (eye.clientWidth / 2);
      const y = eye.getBoundingClientRect().top + (eye.clientHeight / 2);
      const rad = Math.atan2(e.pageX - x, e.pageY - y);
      const rot = (rad * (180 / Math.PI) * -1) + 270;
      eye.style.transform = "rotate(" + rot + "deg)";
    });
  });
}

// 云朵拖拽功能
function initCloudDrag() {
  const cloud = document.querySelector('.cloud');
  if (!cloud) return;

  let isDragging = false;
  let startX, startY, initialX, initialY;

  cloud.addEventListener('mousedown', (e) => {
    isDragging = true;
    cloud.classList.add('dragging');
    
    startX = e.clientX;
    startY = e.clientY;
    initialX = cloud.offsetLeft;
    initialY = cloud.offsetTop;
    
    e.preventDefault();
  });

  document.addEventListener('mousemove', (e) => {
    if (!isDragging) return;
    
    const deltaX = e.clientX - startX;
    const deltaY = e.clientY - startY;
    
    cloud.style.left = (initialX + deltaX) + 'px';
    cloud.style.top = (initialY + deltaY) + 'px';
  });

  document.addEventListener('mouseup', () => {
    if (isDragging) {
      isDragging = false;
      cloud.classList.remove('dragging');
    }
  });

  // 触摸设备支持
  cloud.addEventListener('touchstart', (e) => {
    isDragging = true;
    cloud.classList.add('dragging');
    
    const touch = e.touches[0];
    startX = touch.clientX;
    startY = touch.clientY;
    initialX = cloud.offsetLeft;
    initialY = cloud.offsetTop;
    
    e.preventDefault();
  });

  document.addEventListener('touchmove', (e) => {
    if (!isDragging) return;
    
    const touch = e.touches[0];
    const deltaX = touch.clientX - startX;
    const deltaY = touch.clientY - startY;
    
    cloud.style.left = (initialX + deltaX) + 'px';
    cloud.style.top = (initialY + deltaY) + 'px';
    
    e.preventDefault();
  });

  document.addEventListener('touchend', () => {
    if (isDragging) {
      isDragging = false;
      cloud.classList.remove('dragging');
    }
  });
}

// 初始化所有动画效果
function initAnimations() {
  // 初始化雨滴动画
  const rainInterval = initRainAnimation();
  
  // 初始化眼睛跟随
  initEyeFollowing();
  
  // 初始化云朵拖拽
  initCloudDrag();
  
  // 返回清理函数（可选）
  return {
    destroy: () => {
      if (rainInterval) {
        clearInterval(rainInterval);
      }
    }
  };
}

// 导出到全局作用域
window.initAnimations = initAnimations;
